<template>
    <div>
        <Button @click="handleReset()">重置分页</Button>
        <Table :columns="columns1" :data="data1"></Table>
        <Page :total="100" :current.sync="current" @on-change="handleChange" :key="pageKey"/>
    </div>
</template>
<script>
export default {
    name:'table',
    data() {
        return {
            current:1,
            pageKey:Math.random(),
            columns1: [
                {
                    title: "Name",
                    key: "name"
                },
                {
                    title: "Age",
                    key: "age"
                },
                {
                    title: "Address",
                    key: "address"
                }
            ],
            data1: [
                {
                    name: "John Brown",
                    age: 18,
                    address: "New York No. 1 Lake Park",
                    date: "2016-10-03"
                },
                {
                    name: "Jim Green",
                    age: 24,
                    address: "London No. 1 Lake Park",
                    date: "2016-10-01"
                },
                {
                    name: "Joe Black",
                    age: 30,
                    address: "Sydney No. 1 Lake Park",
                    date: "2016-10-02"
                },
                {
                    name: "Jon Snow",
                    age: 26,
                    address: "Ottawa No. 2 Lake Park",
                    date: "2016-10-04"
                }
            ]
        };
    },
    methods: {
        handleReset(){
            this.current = 1;
            //this.pageKey = Math.random();
        },
        handleChange(page){
            console.log(page)
        }
    },
};
</script>
